import 'package:PollOnLine/main.dart';
import 'package:PollOnLine/values/MyColors.dart';
import 'package:PollOnLine/widget/SeparatorRow.dart';
import 'package:PollOnLine/widget/empty_view.dart';
import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

import '../../../bean/UserTaskWrite.dart';
import '../../../r.dart';
import 'task_detail_logic.dart';

// 任务详情
class TaskDetailPageIpad extends StatefulWidget {
  final String title;

  const TaskDetailPageIpad({Key? key, required this.title}) : super(key: key);

  @override
  State<TaskDetailPageIpad> createState() => _TaskDetailPageIpadState();
}

class _TaskDetailPageIpadState extends State<TaskDetailPageIpad> {
  final logic = Get.put(TaskDetailLogic());
  final state = Get.find<TaskDetailLogic>().state;

  @override
  Widget build(BuildContext context) {
    return GetBuilder<TaskDetailLogic>(builder: (logic) {
      return OrientationBuilder(builder: (context, Orientation orientation) {
        return Scaffold(
          backgroundColor: MyColors.FFEDF1F5,
          appBar: BrnAppBar(title: "执行任务", themeData: XxxConfigUtils.defaultIpadAppBarConfig),
          body: Stack(
            children: [
              Image.asset(orientation == Orientation.portrait ? R.assetsImgBgHome2Ipad : R.assetsImgBgHome2IpadL,
                  fit: BoxFit.fill, width: Get.width, height: 200.r),
              SmartRefresher(
                controller: logic.refreshController,
                //  允许下拉刷新
                enablePullDown: false,
                // 允许上拉加载
                enablePullUp: true,
                // 加载
                onLoading: logic.onLoading,
                footer: ClassicFooter(height: Get.bottomBarHeight + 40.r, textStyle: TextStyle(fontSize: 10.r, color: Colors.grey)),
                child: SingleChildScrollView(
                  child: Column(
                    children: [
                      Container(
                        margin: EdgeInsets.only(left: 12.r, right: 12.r, top: 8.r),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Row(
                              children: [
                                BrnTagCustom.buildBorderTag(
                                  tagText: logic.getStatus(state.status)['tagText'],
                                  textColor: Colors.white,
                                  borderColor: Colors.white,
                                  borderWidth: 0.5.r,
                                  fontSize: 9.r,
                                  textPadding: EdgeInsets.symmetric(vertical: 1.r, horizontal: 4.r),
                                ),
                                Flexible(
                                  child: Padding(
                                    padding: EdgeInsets.only(left: 6.5.r),
                                    child: Text(
                                      state.taskName,
                                      overflow: TextOverflow.clip,
                                      maxLines: 1,
                                      style: TextStyle(color: Colors.white, fontSize: 16.r, fontWeight: FontWeight.bold),
                                    ),
                                  ),
                                ),
                              ],
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 5.r),
                              child: Text("截止时间：${state.endTime}", style: TextStyle(color: Colors.white, fontSize: 9.r)),
                            ),
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 12.r, right: 12.r, top: 8.r),
                        child: BrnShadowCard(
                          color: MyColors.FFB3B3B3,
                          circular: 3.r,
                          spreadRadius: 0.11.r,
                          blurRadius: 0.4.r,
                          child: Container(
                            height: 88.r,
                            decoration: BoxDecoration(
                              gradient: const LinearGradient(
                                colors: [MyColors.FFD5F1FD, Colors.white],
                                end: Alignment.bottomCenter,
                                begin: Alignment.topCenter,
                              ),
                              borderRadius: BorderRadius.all(Radius.circular(3.r)),
                            ),
                            padding: EdgeInsets.only(top: 13.r, bottom: 13.r, left: 10.r, right: 10.r),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Row(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text("所属项目:", style: TextStyle(color: MyColors.FF888888, fontSize: 9.r)),
                                    Flexible(
                                      child: Padding(
                                        padding: EdgeInsets.only(left: 6.r),
                                        child: Text(state.title,
                                            overflow: TextOverflow.ellipsis, maxLines: 1, style: TextStyle(color: MyColors.FF333333, fontSize: 9.r)),
                                      ),
                                    ),
                                  ],
                                ),
                                Row(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text("任务说明:", style: TextStyle(color: MyColors.FF888888, fontSize: 9.r)),
                                    Flexible(
                                      child: Padding(
                                        padding: EdgeInsets.only(left: 6.r),
                                        child: Text(
                                          state.taskDesc,
                                          overflow: TextOverflow.ellipsis,
                                          maxLines: 1,
                                          style: TextStyle(color: MyColors.FF333333, fontSize: 9.r),
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                                Row(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text("调查样本:", style: TextStyle(color: MyColors.FF888888, fontSize: 9.r)),
                                    Flexible(
                                      child: Padding(
                                        padding: EdgeInsets.only(left: 6.r),
                                        child: Text("${state.collectCount}个", style: TextStyle(color: MyColors.FF333333, fontSize: 9.r)),
                                      ),
                                    ),
                                  ],
                                ),
                                Row(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text("其他要求:", style: TextStyle(color: MyColors.FF888888, fontSize: 9.r)),
                                    Flexible(
                                      child: Padding(
                                        padding: EdgeInsets.only(left: 8.r),
                                        child: SeparatorRow(
                                          separatorBuilder: (int index) {
                                            return Padding(
                                              padding: EdgeInsets.only(left: 10.r, right: 10.r),
                                              child: SizedBox(height: 10.r, child: VerticalDivider(color: MyColors.FFD0D0D0, width: 0.5.r)),
                                            );
                                          },
                                          children: [
                                            if (state.isPosition)
                                              BrnIconButton(
                                                  name: '定位',
                                                  direction: Direction.left,
                                                  widgetWidth: 42.r,
                                                  widgetHeight: 16.r,
                                                  iconWidget: Image.asset(R.assetsImgIconHome3),
                                                  iconWidth: 8.r,
                                                  style: TextStyle(color: MyColors.FF333333, fontSize: 9.r),
                                                  onTap: () {}),
                                            if (state.isVideo)
                                              BrnIconButton(
                                                  name: '拍照',
                                                  direction: Direction.left,
                                                  widgetWidth: 42.r,
                                                  widgetHeight: 16.r,
                                                  iconWidget: Image.asset(R.assetsImgIconHome4),
                                                  iconWidth: 8.r,
                                                  style: TextStyle(color: MyColors.FF333333, fontSize: 9.r),
                                                  onTap: () {}),
                                            if (state.isRecord)
                                              BrnIconButton(
                                                  name: '录音',
                                                  direction: Direction.left,
                                                  widgetWidth: 42.r,
                                                  widgetHeight: 16.r,
                                                  iconWidget: Image.asset(R.assetsImgIconHome5),
                                                  iconWidth: 8.r,
                                                  style: TextStyle(color: MyColors.FF333333, fontSize: 9.r),
                                                  onTap: () {}),
                                            if (state.isSignature)
                                              BrnIconButton(
                                                  name: '签名',
                                                  direction: Direction.left,
                                                  widgetWidth: 42.r,
                                                  widgetHeight: 16.r,
                                                  iconWidget: Image.asset(R.assetsImgIconHome11),
                                                  iconWidth: 8.r,
                                                  style: TextStyle(color: MyColors.FF333333, fontSize: 9.r),
                                                  onTap: () {}),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 12.r, right: 12.r, top: 10.r),
                        child: BrnShadowCard(
                          color: Colors.white,
                          circular: 3.r,
                          spreadRadius: 0.11.r,
                          blurRadius: 0.4.r,
                          child: Container(
                            height: 110.r,
                            padding: EdgeInsets.only(top: 13.r, bottom: 13.r, left: 10.r, right: 10.r),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    Text("数据统计", style: TextStyle(color: MyColors.FF313336, fontSize: 12.r, fontWeight: FontWeight.bold)),
                                    Text("该数据最后统计时间：${state.updateTime}", style: TextStyle(color: MyColors.FFA2A7AE, fontSize: 9.r)),
                                  ],
                                ),
                                SizedBox(
                                  height: 34.r,
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                                    children: [
                                      Column(
                                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                        children: [
                                          Text("任务进度", style: TextStyle(color: MyColors.FF333333, fontSize: 9.r)),
                                          Text(logic.getPercent(state.writeCount, state.collectCount),
                                              style: TextStyle(color: MyColors.FF333333, fontSize: 14.r, fontWeight: FontWeight.bold)),
                                        ],
                                      ),
                                      SizedBox(height: 25.r, child: VerticalDivider(color: MyColors.FFD0D0D0, width: 0.5.r)),
                                      Column(
                                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                        children: [
                                          Text("有效问卷", style: TextStyle(color: MyColors.FF333333, fontSize: 9.r)),
                                          Text("${state.writeCount - state.validCount}",
                                              style: TextStyle(color: MyColors.FF333333, fontSize: 14.r, fontWeight: FontWeight.bold)),
                                        ],
                                      ),
                                      SizedBox(height: 36.r, child: VerticalDivider(color: MyColors.FFD0D0D0, width: 0.5.r)),
                                      Column(
                                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                        children: [
                                          Text("无效问卷", style: TextStyle(color: MyColors.FF333333, fontSize: 9.r)),
                                          Text("${state.validCount}",
                                              style: TextStyle(color: MyColors.FF333333, fontSize: 14.r, fontWeight: FontWeight.bold)),
                                        ],
                                      ),
                                    ],
                                  ),
                                ),
                                Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    ClipRRect(
                                      borderRadius: BorderRadius.all(Radius.circular(3.r)),
                                      child: BrnProgressChart(
                                        key: UniqueKey(),
                                        width: Get.width - 70.r,
                                        height: 5,
                                        value: state.writeCount / state.collectCount > 1 ? 1 : state.writeCount / state.collectCount,
                                        showAnimation: true,
                                        colors: [logic.getStatus(state.status)['proColor'], logic.getStatus(state.status)['proColor']],
                                        backgroundColor: MyColors.FFE5E5E5,
                                        brnProgressIndicatorBuilder: (BuildContext context, double value) {
                                          return const Text('');
                                        },
                                      ),
                                    ),
                                    Text(logic.getPercent(state.writeCount, state.collectCount),
                                        style: TextStyle(color: MyColors.FF666666, fontSize: 10.r))
                                  ],
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 12.r, right: 12.r, top: 10.r, bottom: 10.r),
                        child: BrnShadowCard(
                          color: Colors.white,
                          circular: 3.r,
                          spreadRadius: 0.11.r,
                          blurRadius: 0.4.r,
                          child: Container(
                            padding: EdgeInsets.only(top: 13.r, bottom: 13.r, left: 7.r, right: 7.r),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text("异常样本", style: TextStyle(color: MyColors.FF333333, fontSize: 12.r, fontWeight: FontWeight.bold)),
                                (state.taskWrite?.content?.length ?? 0) > 0
                                    ? ListView.builder(
                                        padding: const EdgeInsets.only(top: 0),
                                        itemCount: state.taskWrite?.content?.length,
                                        shrinkWrap: true,
                                        //解决无线高度问题 解决SingleChildScrollView 和listview冲突问题 ListView.builder
                                        physics: const NeverScrollableScrollPhysics(),
                                        itemBuilder: (BuildContext context, int index) {
                                          return ListItem(state.taskWrite!.content![index]);
                                        })
                                    : EmptyView(orientation: orientation),
                              ],
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
          bottomNavigationBar: Visibility(
            visible: state.isShowBottom,
            child: SafeArea(
              child: Container(
                height: 40.r,
                margin: EdgeInsets.only(left: 12.r, right: 12.r, bottom: 12.r, top: 12.r),
                child: ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    padding: const EdgeInsets.all(0),
                    backgroundColor: MyColors.FF0144B0,
                    shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(3.r))),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Image.asset(R.assetsImgIconHome7, width: 14.5),
                      Padding(padding: EdgeInsets.all(10.r), child: Text("新增样本", style: TextStyle(color: Colors.white, fontSize: 12.r)))
                    ],
                  ),
                  onPressed: () {
                    logic.goToAddPoll();
                  },
                ),
              ),
            ),
          ),
        );
      });
    });
  }

  Widget ListItem(Content item) {
    return Container(
      height: 32.r,
      margin: EdgeInsets.only(top: 5.r),
      padding: EdgeInsets.only(left: 8.r, right: 8.r),
      decoration: BoxDecoration(
        color: MyColors.FFF2F5F7,
        borderRadius: BorderRadius.all(Radius.circular(5.r)),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row(
            children: [
              SizedBox(width: 50.r, child: Text(item.writeNo ?? "", maxLines: 1, style: TextStyle(color: MyColors.FF333333, fontSize: 10.r))),
              Padding(
                padding: EdgeInsets.only(left: 3.5.r),
                child: BrnTagCustom(
                  tagText: logic.getTaskWriteInfo(item.recordCount, item.signCount, item.videoCount),
                  textColor: MyColors.FFED6C04,
                  backgroundColor: MyColors.FFFCF0DF,
                  fontSize: 9.r,
                  textPadding: EdgeInsets.symmetric(vertical: 1.r, horizontal: 6.r),
                ),
              ),
            ],
          ),
          // 0 异常关闭  1缺少
          BrnIconButton(
            name: "立即补充",
            iconWidget: Image.asset(R.assetsImgIconHome6),
            iconWidth: 9.r,
            direction: Direction.left,
            widgetWidth: 80.r,
            style: TextStyle(color: MyColors.FF1060DD, fontSize: 10.r),
            onTap: () {
              logic.goToCompletion(item);
            },
          )
        ],
      ),
    );
  }

  @override
  void dispose() {
    Get.delete<TaskDetailLogic>();
    super.dispose();
  }
}
